<!--
 * @Descripttion: 
 * @version: 
 * @Author: by
 * @Date: 2021-10-21 16:27:37
 * @LastEditors: tc
 * @LastEditTime: 2022-01-10 15:12:51
-->
<template>
    <div class="middlebox">
        <div class="title-h">
            <div>
                <img src="@/assets/img/dashboard/装饰_.png" alt="">
                实况视频
            </div>
            <img src="@/assets/img/dashboard/边角.png" alt="">
        </div>
        <div class="video-ty">
            <video class="video-ya" preload="auto" controls autoplay="autoplay" ref="videos" muted loop src="@/assets/img/shipin111.mp4"></video>
        </div>
        
    </div>
</template>

<script>
export default {
    props: {
        data: {
            default: () => {}
        }
    },
    data() {
        return {

        }
    },
    watch: {
        data: {
            handler(val) {
                // this.currentInfo = val[0]
                // this.renderData(val)
            },
            deep:true
        }
    },
    mounted() {
    },
    unmounted() {

    },
    methods: {
       
    }
}
</script>

<style lang="scss" scoped>
.middlebox {
    height: 100%;
    // padding: 7% 20px;
    box-sizing: border-box;
    .video-ty {
        width: 100%;
        background-color: rgba(0, 50, 76, 0.85);
        margin-top: 10px;
        padding: 20px;
        box-sizing: border-box;
        height: calc(100% - 60px);
        display: flex;
        .video-ya {
            object-fit:fill;
            width: 100%;
        }
    }
}
</style>